/** @type {import('tailwindcss').Config} */
export default {
  //配置vue后缀
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx,vue}'],
  theme: {
    // 扩展需要 不要直接写 会覆盖tailwind原来的样式
    extend: {
      colors: {
        'theme-color': '#2fc1ff',
        gray: '#999',
      },
      fontSize: {
        '16px': '16px',
        '14px': '14px',
      },

      animation: {
        bounce: 'bounce 1s ease-in-out infinite',
      },

      keyframes: {
        bounce: {
          '0%, 100%': { transform: 'rotate(-3deg)' },
          '50%': {
            transform: 'rotate(3deg)',
          },
        },

        rain: {
          '0%': {
            transform: 'translateY(0) scale(1)',
          },

          '80%': {
            transform: 'translateY(230px) scale(1)',
          },

          '100%': {
            transform: 'translateY(230px) scale(1.3)',
            opacity: ' 0',
          },
        },
      },
    },
  },

  plugins: [],
};
